import { defineStore } from 'pinia'
import {
  getDepartmentData,
  getRoleData,
  getAllMenusData
} from '@/service/main/main'
import localStorage from '@/utils/local-storage'
interface IMain {
  [key: string]: any
}

const layoutConfig = {
  layoutMode: 'Default',
  shrink: false,
  mainAnimation: 'slide-right',
  // 是否暗黑模式
  isDark: true,
  /* 侧边菜单 */
  // 侧边菜单背景色
  menuBackground: ['#001529', '#1d1e1f'],
  // 侧边子菜单背景色
  menuItemBackground: ['#0c2135', '#2d2d2d'],
  // 侧边菜单文字颜色
  menuColor: ['#b7bdc3', '#CFD3DC'],
  // 侧边菜单激活项背景色
  menuActiveBackground: ['#0a60bd', '#0a60bd'],
  // 侧边菜单激活项文字色
  menuActiveColor: ['#fff', '#fff'],
  // 侧边菜单顶栏背景色
  menuTopBarBackground: ['#00152905', '#1d1e1f'],
  // 侧边菜单宽度(展开时)，单位px
  menuWidth: 210,
  // 是否只保持一个子菜单的展开(手风琴)
  menuUniqueOpened: false,
  // 显示菜单栏顶栏(LOGO)
  menuShowTopBar: true,
  /* 顶栏 */
  // 顶栏文字色
  headerBarTabColor: ['#000', '#CFD3DC'],
  // 顶栏激活项背景色
  headerBarTabActiveBackground: ['#0a60bd', '#0a60bd'],
  // 顶栏激活项文字色
  headerBarTabActiveColor: ['#fff', '#fff'],
  // 顶栏背景色
  headerBarBackground: ['#ffffff', '#2d2d2d'],
  // 顶栏悬停时文字色
  headerBarHoverColor: ['#409eff', '#409eff']
}

const useMainStore = defineStore('main', {
  state: (): IMain => ({
    showLoading: false,
    departmentData: [],
    roleData: [],
    allMenusData: [],
    // 菜单选中下标
    menu_tab_current: '',
    isCollapse: false,
    tabFullScreen: false,
    // 路由是否保持活性
    keepLiveRouteName: new Set(),
    //路由组建的key
    routerComponentKey: '',
    layoutConfig: JSON.parse(JSON.stringify(layoutConfig)) //深拷贝一下防止,后续重置污染原来的数据,不能重置
  }),
  getters: {
    getKeepLiveRouteName(): any {
      return Array.from(this.keepLiveRouteName)
    }
  },
  actions: {
    // 获取角色数据和部门数据初始化就获取以便多个页面使用
    // 1.请求部门和角色数据在login那边初始化路由的时候顺便调用这个方法
    async initRDdataAction() {
      this.getDepartmentDataAction()
      this.getRoleDataAction()
      this.getAllMenusDataAction()
      this.setConfigAciton()
    },

    async getDepartmentDataAction() {
      const departmentResult = await getDepartmentData()
      this.departmentData.length = 0
      this.departmentData.push(...departmentResult.data.list)
    },
    async getRoleDataAction() {
      const roleResult = await getRoleData()
      this.roleData.length = 0
      this.roleData.push(...roleResult.data.list)
    },
    async getAllMenusDataAction() {
      const getAllMenusResult = await getAllMenusData()
      this.allMenusData.length = 0
      this.allMenusData.push(...getAllMenusResult.data.list)
    },
    // 初始化布局配置
    setConfigAciton() {
      this.layoutConfig = localStorage.get('config') || this.layoutConfig
    },
    // 重置布局配置
    resetConfigAciton() {
      console.log(layoutConfig)
      this.layoutConfig = JSON.parse(JSON.stringify(layoutConfig))
    },

    chageCurrentAction(current: string) {
      this.menu_tab_current = current
    },

    getColorAction(name: any) {
      if (!this.layoutConfig.isDark) {
        return this.layoutConfig[name][0]
      } else {
        return this.layoutConfig[name][1]
      }
    }
  }
})

export default useMainStore
